import { _decorator, Component, instantiate, Layout, Node, Pool, Prefab, resources, Sprite, SpriteFrame } from 'cc';
const { ccclass, property, requireComponent } = _decorator;

const replace = new Map();

replace.set("/", "Slash");


@ccclass('UIImageLabel')
@requireComponent(Layout)
export class UIImageLabel extends Component {
    @property(Prefab)
    numberPrefab: Prefab = null;

    numPool: Pool<Node> = null;

    layout: Layout;


    private _string: string ="";

    get string():string{
        return this._string;
    }

    set string(val: string){
        if(this._string == val)
            return;

        this._string = val;
        this.resetString();
    }
    

    start() {
        this.layout = this.node.getComponent(Layout);

        this.numPool = new Pool(():Node=>{
            const node = instantiate(this.numberPrefab);
            this.node.addChild(node);
            node.active = false;
            return node;
        }, 5, (node:Node)=>{
            node.removeFromParent()
        })

        this.string = "123"
    }

    onDestroy()
    {
        this.numPool.destroy();
    }

    update(deltaTime: number) {
        
    }

    resetString()
    {
        this.clearString();

        const dir = 'ui/art/num/';
        
        resources.loadDir(dir, ()=>{
            for (let i=0; i < this.string.length; i++)
            {
                let char = this.string[i].toString();
                if(replace.has(char))
                {
                    char = replace.get(char)
                }
                const path = dir + char + "/spriteFrame";
                const spriteFrame = resources.get(path, SpriteFrame);

                const spriteNode = this.numPool.alloc();
                const sprite = spriteNode.getComponent(Sprite);
                sprite.spriteFrame = spriteFrame;
                spriteNode.active = true;
                spriteNode.setSiblingIndex(i);
            }
            this.layout.updateLayout();
           
        })
    }
    
    clearString()
    {
        for(let child of this.node.children)
        {
            child.active = false;
            this.numPool.free(child);
        }
    }
}

